<template>
  <div style="height: 100%;overflow:hidden" class="main">
    <!-- <x-header :left-options="{preventGoBack:true,backText: ''}" @on-click-back="backhome">隐患上报<div id="headeright"  @click="dangereport">上报</div></x-header> -->
    <x-header :left-options="{preventGoBack:true,backText: ''}" @on-click-back="backhome">
      日常巡检
      <!-- <x-icon id="headeright" type="ios-plus-empty" size="30" @click="dangereport"></x-icon> -->
      <!-- <img slot="right"
           src="@/assets/img/online_start.png"
           @click="dangereport"
           id="headeright"
      />-->
      <img
        slot="right"
        src="@/assets/img/white_change.png"
        class="changeToOffline"
        @click="changeToOffline"
      />
    </x-header>
    <!-- <div class="add_form" @click="dangereport"
    v-if="this.dailyArr.includes('0')">发起</div>-->
    <div class="add_form_new" @click="dangereport" v-if="this.dailyArr.includes('0')">发起</div>
    <div class="sup"></div>
    <!-- <cell is-link link="proListc">
      <span slot="title" class="select_pro">{{showPro(pro)}}</span>
    </cell>-->
    <select-project
      :title="dailyCheckTitle"
      formType="rectify"
      module="danger"
      status="view"
      @selectAllPro="selectAllPro"
      @selectPro="selectPro"
      class="selectPro"
    ></select-project>
    <div class="sup"></div>
    <div class="main-container" style="overflow:auto;height:86%">
      <v-touch v-on:swiperight="onSwipeRight" :swipe-options="{direction: 'horizontal'}">
        <scroller :on-refresh="refresh" :on-infinite="infinite" ref="taskScroller">
          <!-- <scroller> -->
          <!-- <scroller> -->
          <!-- content -->
          <div style="margin-bottom:30px">
            <group v-for="(item, i) in list" gutter="-1px" :key="i">
              <div title :border-intent="false" @click="openInfo(item)" v-if="item.STATE != '暂存'">
                <div
                  class="more-box"
                  style="margin-left: 30px;margin-right: 30px;margin-bottom: 15px;margin-top: 15px"
                >
                  <div class="project_style">
                    <span style="display:inline-block">{{item.PRJNAME}}</span>
                  </div>
                  <div class="fill_user">
                    <span class="gray-label" style="margin-right: 10px;">填写人</span>
                    {{item.INPUTERFULLNAME}}
                  </div>
                  <div class="state_time_style">
                    <div name="state">
                      <img
                        src="@/assets/img/undo.png"
                        v-if="item.STATE=='未完成'"
                        style="height: 24px;"
                      />
                      <img
                        src="@/assets/img/done.png"
                        style="height: 24px;"
                        v-if="item.STATE=='已完成'"
                      />
                    </div>
                    <div class="fill_time">
                      <span class="gray-label" style="margin-right: 10px;">填写时间</span>
                      {{item.INPUTDATE.substring(0,10)}}
                    </div>
                  </div>
                </div>
              </div>
            </group>
          </div>
        </scroller>
      </v-touch>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "hidangerlist",
  // inject:['reload'],
  components: {},
  mounted() {
    //console.log("asdasdas");
    //console.log(row());
    //this.$router.go(0)
    //  this.reload();
    //location.reload()
    // this.getData();
  },
  data() {
    return {
      list: [],
      page: 1,
      keyword: "",
      createPop: false, //弹出层是否创建
      loading: false, //下拉刷新时禁止无限加载
      //currentTab:'待整改',
      //tabs:['待整改','已整改']
      pro: this.$route.query.pro,
      proId: this.$route.query.proId,
      site: this.$route.query.site,
      SUPERVISORFULLNAME:
        this.$route.query.supervisorFullName === undefined
          ? ""
          : this.$route.query.supervisorFullName,
      SUPERVISORNAME:
        this.$route.query.supervisorName === undefined
          ? ""
          : this.$route.query.supervisorName,
      person:
        this.$route.query.reformer === undefined
          ? ""
          : this.$route.query.reformer,
      personId:
        this.$route.query.reformerId === undefined
          ? ""
          : this.$route.query.reformerId,
      guid: "",
      filter: "",
      dailyArr: this.$store.state.dailyArr,
      dailyCheckTitle:
        this.$route.query.pro === undefined ? "全部项目" : this.$route.query.pro
      //proName:'',
    };
  },
  methods: {
    selectPro(val) {
      console.log(val);
      this.proId = val.id;
      this.pro = val.name;
      this.site = val.site;
      this.dailyCheckTitle = val.name;
      this.SUPERVISORFULLNAME =
        val.supervisorFullName === undefined ? "" : val.supervisorFullName;
      this.SUPERVISORNAME =
        val.supervisorName === undefined ? "" : val.supervisorName;
      this.person = val.reformer === undefined ? "" : val.reformer;
      this.personId = val.reformerId === undefined ? "" : val.reformerId;
      this.page = 1;
      this.list = [];
      this.getData(
        res => {
          if (res.status == "200" && res.data.datas.length > 0) {
            this.list = [...this.list, ...res.data.datas]; //TODO 啥意思
            this.page++;
            done();
          } else {
            done(true); //有错误的情况或者没有记录，传参true
          }
        },
        () => {}
      );
    },
    selectAllPro(val) {
      this.dailyCheckTitle = val;
      this.proId = 0;
      this.page = 1;
      this.list = [];
      this.getData(
        res => {
          if (res.status == "200" && res.data.datas.length > 0) {
            this.list = [...this.list, ...res.data.datas]; //TODO 啥意思
            this.page++;
            done();
          } else {
            done(true); //有错误的情况或者没有记录，传参true
          }
        },
        () => {}
      );
    },
    changeToOffline() {
      this.$router.push({
        name: "offlineCklist",
        path: "/offlineCklist"
      });
    },
    onSwipeRight() {
      this.$router.push("/index/home");
    },
    backhome() {
      this.$router.push("/index/home");
    },
    getData(callback, failed) {
      // var filter = "STATE<>'废弃'";
      // //console.log(this.proId);
      // if (!this.proId) {
      //   filter =
      //     "STATE<>'废弃'" +
      //     (this.dailyArr.includes("0")
      //       ? ""
      //       : "and SYSPRJID IN (" + this.dailyArr.join(",") + ")");
      // } else {
      //   filter = "SYSPRJID='" + this.proId + "'and STATE<>'废弃'";
      // }
      // var params =
      //   '{"_method":"component.getListData","_param":{"bizObj":"SAFECHECKINSPECT","service":"selectMore","fields":"*","filter":"' +
      //   filter +
      //   '","currentPageIndex":' +
      //   this.page +
      //   ',"pageSize":50,"orderList":[{"field":"NUMZZ","order":"DESC"}],"QueryFormData":""}}';
      
     var params = {
       _method:"component.getListData",
       _param:{
          bizObj:"SAFECHECKINSPECT",
          service:"selectMore",
          fields:"*",
          filter:{
            phone:{}
          },
          currentPageIndex:this.page,
          pageSize:50,
          orderList:[{
            field:"NUMZZ",
            order:"DESC"
          }],
          QueryFormData:""
       }
     }   
      this.$ajax({
        method: "post",
        url: this.COMMON_URL, //+ '?_objName=SAFECHECKINSPECT&_viewId=SAFECHECKINSPECT_list',
        // data: this.signMD5({
        //   FixJSON: params
        // })
        data: {
          FixJSON:JSON.stringify(params) 
        }
      })
        .then(res => {
          callback(res);
          // console.log("dailyCheck",res);
          // this.list = [...res.data.datas];
          // this.page++;
        })
        .catch(err => {
          // failed()
        });
      // this.reload();
      //this.$router.go(0)
    },
    openInfo(item) {
      this.$router.push({
        path: "/dailyCheck/checkInfo1",
        query: { GUID: item.GUID, pro: item.PRJNAME, site: item.CENTERPOSITION }
      });
    },
    infinite(done) {
      //上划加载方法
      // console.log("infinite");
      // console.log(this.page);

      this.getData(
        res => {
          //res.data.datas中的字段都是大写的，res.data.data中的字段有小写的
          if (res.status == "200" && res.data.datas.length > 0) {
            this.list = [...this.list, ...res.data.datas]; //TODO 啥意思
            this.page++;
            done();
          } else {
            done(true); //有错误的情况或者没有记录，传参truedie
          }
        },
        () => {
          done(true);
        }
      );
    },
    refresh(done) {
      this.page = 1;
      // // console.log("refresh");
      // // console.log(this.page);
      // debugger
      // this.loading = true;
      this.getData(
        res => {
          if (res.status == "200" && res.data.datas.length > 0) {
            this.list = [...res.data.datas];
            this.page++;
            done();
          } else {
            done(true);
          }
          this.loading = false;
        },
        () => {
          done(true);
        }
      );
    },
    search(val) {
      this.page = 1;
      this.keyword = val;
      this.getData(
        res => {
          if (res.status == "200" && res.data.datas.length > 0) {
            this.list = [...res.data.datas];
            this.page++;
          } else {
            this.list = [];
          }
        },
        () => {
          this.list = [];
        }
      );
    },
    dangereport() {
      //this.$router.push('/hidangereport/InspectionInfo');
      //this.$router.replace('/reportdanger')
      //console.log(this.proId)
      // this.$router.push({ path: '/dailyCheck/checkInfo', query: { centerPosition: this.site, pro: this.pro, proId: this.proId } })

      if (this.checkNetWork()) {
        this.$router.push({
          path: "/dailyCheck/checkInfo",
          query: {
            centerPosition: this.site,
            pro: this.pro,
            proId: this.proId,
            pmname: this.proDept,
            reformer: this.person,
            reformerId: this.personId,
            supervisorFullName: this.SUPERVISORFULLNAME,
            supervisorName: this.SUPERVISORNAME
          }
        });
      } else {
        const _this = this;
        //执行离线状态时的任务
        this.$vux.confirm.show({
          // 组件除show外的属性
          title: "提示",
          content: "当前手机处于离线状态，确定启用离线功能？",
          onCancel() {},
          onConfirm() {
            _this.$router.push({
              path: "/dailyCheck/checkInfo",
              query: {
                centerPosition: _this.site,
                pro: _this.pro,
                proId: _this.proId,
                pmname: _this.proDept,
                reformer: _this.person,
                reformerId: _this.personId,
                supervisorFullName: _this.SUPERVISORFULLNAME,
                supervisorName: _this.SUPERVISORNAME
              }
            });
          }
        });
      }
    },
    changeType(val) {
      this.page = 1;
      this.currentTab = val;
      this.list = [];
      this.$refs.taskScroller.finishInfinite(false);
      /* this.getData((res) => {
           //res.data.datas中的字段都是大写的，res.data.data中的字段有小写的
           if (res.status == '200' && res.data.datas.length > 0) {
               this.list = [...this.list, ...res.data.datas]//TODO 啥意思
               this.page++;
               done();
           } else {
             done(true)//有错误的情况或者没有记录，传参true
           }
         }, () => {
           done(true)
       });*/
    },
    showPro(pro) {
      return !!pro ? pro : "全部项目";
    }
  },
  // subYear(item.INPUTDATE){
  //   console.log(item.INPUTDATE);
  //   return time
  // },
  computed: {
    // userInfo () {
    //   return this.$store.state.user
    // },
    // mainPop () {
    //   return this.$store.state.mainPop
    // }
    row() {
      //页面中使用row来指代当前记录
      // console.log(this.$store.state.currentRow);
      return this.$store.state.currentRow;
    }
  },
  watch: {
    proId: function(newId, old, Id) {
      // this.reload()
      // location.reload()
      //console.log("刷新")
    }
  }
};
</script>

<style scoped>
/* .transition-view /deep/ .vux-header .vux-header-left .left-arrow:before {
  border-color: rgb(35, 90, 230);
}
.transition-view /deep/ .vux-header {
  background-color: rgb(255, 255, 255) !important;
}
.transition-view .vux-header /deep/ .vux-header-title {
  color: #262a34;
} */
.card {
  background: #fff;
  margin: 10px 16px;
  padding: 20px;
  border-radius: 4px;
  overflow: hidden;
}

.card-title {
  font-size: 18px;
}
.warning {
  color: red;
  padding: 0 5px;
  background-color: pink;
  text-align: center;
  width: 140px;
  line-height: 30px;
  font-size: 14px;
}

.gray-label {
  color: gray;
}

#headeright {
  position: absolute;
  right: 15px;
  top: 10px;
  display: block;
  font-size: 14px;
  line-height: 21px;
  color: #fff;
}
.box-bar:before {
  content: "";
  display: block;
  height: 17px;
  position: absolute;
  border-left: 4px solid #a7aeff;
  left: 14px;
  top: 18px;
}
.hidanger-chosetaskfontshow {
  max-width: 70px;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  /*设置overflow后基线位置改变，因此需要调整*/
  vertical-align: bottom;
}
#headeright {
  position: absolute;
  right: 0px;
  top: 5px;
  display: block;
  font-size: 14px;
  line-height: 21px;
  width: 20px;
  height: 20px;
}
.changeToOffline {
  margin-right: auto;
  width: 25px;
  height: 25px;
  /* margin-top: 10px; */
}
.add_form {
  position: absolute;
  height: 50px;
  width: 90%;
  top: 90%;
  z-index: 999;
  left: 5%;
  background: #4d86ff;
  color: #ffffff;
  font-size: 16px;
  font-family: PingFang SC;
  font-weight: 400;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.add_form_new {
  position: absolute;
  width: 50px;
  height: 50px;
  top: 80%;
  z-index: 999;
  left: 80%;
  background: rgba(77, 134, 255, 1);
  box-shadow: 0px 1px 13px 0px rgba(79, 132, 220, 0.6);
  border-radius: 50%;
  color: #ffffff;
  font-size: 14px;
  font-family: PingFang SC;
  font-weight: 400;
  line-height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sup {
  width: 100%;
  height: 10px;
  border-radius: 0;
  background-color: #f5f5f5;
}
.select_pro {
  font-size: 15px;
  font-family: PingFang SC;
  font-weight: 600;
  color: rgba(25, 25, 25, 1);
  line-height: 20px;
}
.project_style {
  font-size: 15px;
  font-family: PingFang SC;
  font-weight: 400;
  color: rgba(25, 25, 25, 1);
  line-height: 20px;
  margin-top: 8px;
}
.state_time_style {
  display: flex;
  margin-top: 8px;
}
.fill_user {
  font-size: 13px;
  font-family: PingFang SC;
  font-weight: 400;
  color: rgba(175, 175, 175, 1);
  line-height: 20px;
}
.fill_time {
  /* margin-top: 8px; */
  margin-left: auto;
  font-size: 12px;
  font-family: PingFang SC;
  font-weight: 400;
  color: rgba(175, 175, 175, 1);
  line-height: 20px;
}
.selectPro /deep/ .my-cell .my-cell-title .weui-label {
  font-size: 15px;
  font-family: PingFang SC;
  font-weight: 600;
  color: rgba(25, 25, 25, 1);
  line-height: 20px;
}
</style>
